<template>
  <div id="carousel" class="carousel" >    
  
    <el-carousel style="height:400px" :interval="5000">
      <el-carousel-item v-for="item in carousel" :key="item.id" style="height:400px">
		<router-link :to="{path:'/goods/details',query:{id:item.id}}" >
        <img :src="$target + item.imgPath" style="height:400px;width:975px; margin: 0;" />
		</router-link>
      </el-carousel-item>
    </el-carousel> 
	
</div>
</template>

<script>
export default {
    name: "carousel",
    data(){
        return{
            carousel:''
        };
    },
    mounted:{

    },
    created(){
    this.$axios
      .post("/api/resources/carousel", {})
      .then(res => {
        this.carousel = res.data.data;
      })
      .catch(err => {
        return Promise.reject(err);
      });        
    }

}
</script>

<style>
.carousel{  
    width: 975px;
    margin-left: 250px;
    margin-top: 1px;
}

</style>